import React from 'react'
import './复制粘贴栗子.css' //引入外部的样式
class ZhanTie1 extends React.Component{
    constructor(){ //
        super()
        this.state={
            selVal:''
        }
    }
    handleCopy=()=>{
        //获取选中的内容
        let selectInfo = window.getSelection().toString()
        // console.log(selectInfo);
        if(!selectInfo){ //如果没有这个值
            selectInfo = document.getElementById('content')
            // console.log(selectInfo.innerText);
        }
        //写入内容到剪贴板
        navigator.clipboard.writeText(selectInfo)
    }
    handlePaste=()=>{
        //读取剪贴板的内容
        navigator.clipboard.readText()
        .then(res=>{
            console.log(res);//打印的结果是我们复制的内容
        let abc = document.getElementById('abc')
            abc.innerText= res
        })
    }
    componentDidMount(){ //钩子函数
        document.onkeydown = function(e){
            e.preventDefault() //阻止键盘默认的事件
        }
        document.oncontextmenu = function(e){
            e.preventDefault() //禁用鼠标的右键
        }  
    }
    render(){
        return(
            <fieldset> 
                <legend>
                    剪贴板
                </legend>
                <div id='content'>啊撒吃撒从但是v狂魔哦v米尔v么如v额啊什么的看v曼德拉是v没哦分v内佛v你都妇女阿斯达克v买饿哦女奥i的v脑子里现场v啊什么的旅程没电视看了sdcsdc</div>
                <div className='abc' id='abc'></div>
                <button onClick={this.handleCopy}>复制</button>
                <button onClick={this.handlePaste}>黏贴</button>
            </fieldset>
        )
    }
}
export default ZhanTie1